<template>
  <div class="root">
    <div class="divBox">
      <div class="content-container">
        <div class="cardBody">
          <span class="header">项目详情</span><span class="asset-title">{{assetDetail.projectName }}</span>
          <el-divider></el-divider>
          <img src="@/assets/icon/icon_plant.png" alt="" class="icon" />
          <span class="asset-little-title">基本信息</span>
          <div class="basic-div">
            <div class="item-div">
              <span class="item-title">国家</span> <br /><span class="item-content">{{ assetDetail.country  }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">省份</span> <br /><span class="item-content">{{ assetDetail["province"]
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">市/县/郡</span> <br /><span class="item-content">{{ assetDetail["city"]
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">项目地点</span> <br /><span class="item-content">{{ assetDetail["address"] }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">立项日期</span> <br /><span class="item-content">{{ assetDetail["initiationDate"] ||
              formatDate }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">采用方法学</span> <br /><span class="item-content">{{
              assetDetail["carbonMethodologyName"] }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">开发机构</span> <br /><span class="item-content">{{
              assetDetail["assetsDevelopAgency"] }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">开发负责人</span>
              <br /><span class="item-content">{{
              assetDetail["principalName"]
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">开发负责人电话</span> <br /><span class="item-content">{{ assetDetail["principalPhone"]
              }}</span>
            </div>
          </div>
          <br />
          <br />
          <img src="@/assets/icon/icon_plant.png" alt="" class="icon" />
          <span class="asset-little-title">项目信息</span><span class="detail" @click="toDetail" v-if="url">查看详情<i
              class="el-icon-d-arrow-right"></i></span>
          <div class="basic-div" style="padding: 20px 16px 20px 16px; height: auto">
            <p class="paragraph">
              {{ assetDetail["projectIntroduction"] }}
            </p>
          </div>
          <br />
          <br />
          <img src="@/assets/icon/icon_plant.png" alt="" class="icon" />
          <span class="asset-little-title">业主信息</span><span class="detail" @click="toDetail" v-if="url">查看详情<i
              class="el-icon-d-arrow-right"></i></span>
          <div class="basic-div" style="height: 174px">
            <div class="item-div">
              <span class="item-title">业主名称</span> <br /><span class="item-content">{{ assetDetail["ownerName"] 
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">业主法人姓名</span> <br /><span class="item-content">{{ assetDetail["legalPersonName"]
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">法人联系方式</span> <br /><span class="item-content">{{ assetDetail["legalPersonPhone"]
              }}</span>
            </div>
            <div class="item-div">
              <span class="item-title">业主营业执照</span>
              <br /><span class="item-content" style="width: 160px; color: #126fff; cursor: pointer;
              display: inline-block; max-width: 600px;white-space:nowrap;
              overflow: hidden;text-overflow: ellipsis"
                @click="handleView(assetDetail.businessLicense)">{{assetDetail.businessLicense || "--"}}</span>
            </div>
          </div>
          <br />
          <br />
          <img src="@/assets/icon/icon_plant.png" alt="" class="icon" />
          <span class="asset-little-title">材料信息</span>
          <div class="fileDiv">
  <div class="item-div">
    <span class="item-title">项目核准/批复文件</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000003')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000003').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000003').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">可行性研究报告</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000001')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000001').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000001').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">环评批复文件</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000004')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000004').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000004').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">环评报告表</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000005')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000005').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000005').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">节能评估报告</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000006')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000006').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000006').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">项目开工建设证明文件</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000007')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000007').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000007').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">项目投产证明文件</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000008')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000008').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000008').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">施工合同</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000010')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000010').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000010').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">主要设备购买合同</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000011')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000011').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000011').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">银行贷款合同/承诺书</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000012')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000012').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000012').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>

  <div class="item-div">
    <span class="item-title">委托开发合同</span>
    <br />
    <template v-if="annexList.find(item => item.fileDictValue === '0230000009')">
      <span 
        class="item-content"
        style="width: 160px; color: #126fff; cursor: pointer;
        display: inline-block; max-width: 600px;white-space:nowrap;
        overflow: hidden;text-overflow: ellipsis"  
        @click="handleView(annexList.find(item => item.fileDictValue === '0230000009').url)"
      >
        {{ annexList.find(item => item.fileDictValue === '0230000009').url }}
      </span>
    </template>
    <template v-else>
      <span class="item-content">无</span>
    </template>
  </div>
</div>
            
          </div>
          <br />
          <div class="basic-div-bottom">
            <button style="width: 96px" class="normal-white-btn" @click="goback">
              返回
            </button>
          </div>
        </div>
      </div>
    </div>
 
</template>

<script>

export default {
  name: "",
  data() {
     let Id = this.$route.query.id
    return {
      id:Id,
      annexList:[],
      assetDetail: {},
      dialogFormVisible: false, //场外报价显示与否
      ownerRunCard: {
        name: "",
        fileDictValueName: "",
        fileDictValue: "",
      
      }, //业主营业执照
    
   
    
    };
  },
 
created(){ this.user = JSON.parse(localStorage.getItem('user') || '{}');
    this.queryProjects();},

  


  methods: {

 queryProjects() {
  const params = {
    tenantId: this.user.tenantId,
    id: this.id
  };

  this.$request.get('/assets/carbonProject/queryBySelector', {
    params: params
  }).then(res => {
    if (res.code === 200) {
      this.assetDetail = res.data.records[0] || {};
      console.log("这是全部碳资产数据", this.assetDetail);
     
      this.$request.get('/assets/carbonProject/getFileList', {
        params: { 
          projectId: this.id
        }
      }).then(res => { 
        if(res.code === 200){
          this.annexList = res.data
        }
      }); 
    }
  }); 
},


  

      handleView(row) {
        const button = document.activeElement;
      // 构建百度搜索URL，将交易所名称作为搜索关键词
      const searchUrl = `${row}`;
      
      // 在新窗口打开百度搜索页面
      window.open(searchUrl, '_blank');
      if (button && button.blur) {
      // 延迟执行，确保跳转逻辑完成后再失焦
       setTimeout(() => {
      button.blur();
   
    }, 100);
      }
 },
  goback() {
      this.$router.go(-1);
    },
   }
};
</script>

<style lang="scss" scoped>
.root {
  background: #f2f5f7;
}

.divBox {
  margin: 20px;
  background: #ffffff;
  box-shadow: 0px 2px 8px 0px #eaf0f3;
  border-radius: 8px;
}

.container {
  margin: 10px 0px 20px 0px;
  display: flex;
  flex-direction: row;
}

.cardBody {
  margin: 30px 30px 30px 30px;
}

.header {
  width: 95px;
  height: 18px;
  font-size: 18px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #24a776;
  line-height: 18px;
}

.asset-title {
  width: 396px;
  height: 18px;
  font-size: 18px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #242b35;
  line-height: 18px;
  margin-left: 20px;
}

.el-divider {
  margin-top: 30px;
}

.icon {
  height: 16px;
  width: 22px;
}

.asset-little-title {
  width: 64px;
  height: 16px;
  font-size: 16px;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #424c5c;
  line-height: 16px;
  margin-left: 10px;
}

.basic-div {
  width: 95%;
  height: 261px;
  background: #f7f9fc;
  border-radius: 6px;
  margin-left: 30px;
  margin-top: 30px;
}

.basic-div-bottom {
  width: 95%;
  height: 174px;
  text-align: right;
  margin-left: 30px;
  margin-top: 15px;
}

.item-title {
  width: 56px;
  height: 14px;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #5e6c84;
  line-height: 14px;
}

.item-content {
  width: 42px;
  height: 15px;
  font-size: 15px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  line-height: 15px;
  position: relative;
  top: 15px;
}

.item-div {
  float: left;
  margin: 24px 10px 20px 10px;
  width: 200px;
  height: 40px;
  // overflow: hidden;
}

.accessory {
  width: 28px;
  height: 14px;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #126fff;
  line-height: 14px;
  margin-left: 10px;
  cursor: pointer;
}

.paragraph {
  width: 95%;
  height: 108px;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #808ea5;
  line-height: 21px;
  text-align: justify;
}

.detail {
  width: 56px;
  height: 14px;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #24a776;
  line-height: 14px;
  margin-left: 15px;
  cursor: pointer;
}

.fileDiv {
  width: 95%;
  min-height: 261px;
  background: #f7f9fc;
  border-radius: 6px;
  margin-left: 30px;
  margin-top: 30px;
}
</style>